<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0, minimum-scale=1.0, maximum-scale=1.0">
    <meta http-equiv="expires" content="0">
    <meta http-equiv="pragma" content="no-cache">
    <META http-equiv="cache-Control" content="no-cache,no-store, must-revalidate">  
    <title>跑么杯</title>
    <link rel="stylesheet" type="text/css" media="screen" href="{$staticHost}/static/css/base.css?v=10" />
    <link rel="stylesheet" type="text/css" media="screen" href="{$staticHost}/static/css/run.css?v=132" />
    <script src="{$staticHost}/static/js/jquery.min.js"></script>
    <script src="{$staticHost}/static/js/js.js"></script>
</head>
<body class="share-box">
<section class="share-bg">
  <a class="gift-box">奖品详情</a>
  <img class="user-img" src="{$userInfo['header']}">
  <!-- 得奖用户头像 -->
  <p class="f18 color-white ac m10">助"{$userInfo['nickname']}"夺得跑么杯人气榜冠军</p>
  <!-- 得奖用户名称 -->
  <section class="countdown">
      <h1 class="f12 color-blue ac">活动倒计时</h1>
      <div>
        <span id="t_d"></span>
        <span>天</span>
        <span id="t_h"></span>
        <span>时</span>
        <span id="t_m"></span>
        <span>分</span>
        <span id="t_s"></span>
        <span>秒</span>
      </div>
  </section>
  <!-- 倒计时 -->
  <p class="rank-box">
    {if $userInfo['rownum']!=1 }
      已收集
      <span class="color-red">{$userInfo['support_num']}</span>
      个赞　排名
      <span class="color-red">{$userInfo['rownum']}</span><br/>
      还需要
      <span class="color-red">{$userInfo['diffLight']}</span>
      个赞超越第一名
    {else}
      第二名仅需<span class="color-red">{$userInfo['diffLight']}</span>赶上Ta喽<br/>
      赶快动动手指为Ta点赞吧
    {/if}
  </p>
  <!-- 点赞数量 -->
  <p class="ac f10 color-blue pb10">快来为Ta点赞吧！</p>
  <img class="praise" src="{$staticHost}/static/images/img/wa.png">
  <!-- 点赞人群 -->
  <section class="color-btn">
    {if $isSelf == 0}
      {if $remainTimes > 0}
       <a id="btn-num" class="red">点赞抽奖({$remainTimes}次) </a>
      {else}
        <a  class="red">明日再来</a>
      {/if}
    {else}
      <a id="convene" class="red">召集好友</a>
    {/if}
    
    <a class="yellow" href="paomeHome">参加跑么杯</a>
  </section>
  <!-- 按钮 -->
  <p class="color-blue pl20 f12">
  {if $remainTimes > 0}
    还有{$remainTimes}次点赞抽奖机会
  {else}
    今日3次抽奖机会用完喽，明日再来吧
  {/if}
  </p>
  <!-- 抽奖次数 说明 -->
  {if $sentimentList}
  <ul class="data-show addrq share-list">
    {loop $sentimentList $k $v}
      <li>
        <span class="days">{eval echo $k+1;}</span>
        <img class="user" src="{$v['header']}"/>
        <p class="color-white f16">{$v['nickname']}</p>
        <span class="km color-white f16">{$v['support_num']}</span>
      </li>
    {/loop}
  </ul>
 {/if}
  <!-- 点赞榜单 -->
</section>
<section id="num-box" class="masklayer" >
  <div class="pao-tier" style="top: 20%; ">
      <span class="pao-close"></span>
      <div class="yellow-share">
          <p class="share-title pt10">
            您的洪荒之力<br/>
            为
            “<span id="username"></span>”
            集了
            <span id="numzan"></span>
            个赞
          </p>
          <img id="jpImg" src="">
          <p class="plr20 color-red f19">
            哇！你抽到“<span id="jpName"></span>”
          </p>
          <p class="f14 color-orange">
            还有
            <span id="jhNum"></span>
            次抽奖机会
          </p>
          <section class="btn-share">
            <a class="yellow-btn">领取奖品</a>
          </section>
      </div>
    </div>
</section>
<!-- 弹框 中奖 -->
<section id="jp-list" class="masklayer" >
  <div class="pao-tier" style="top: 20%; ">
      <span class="pao-close"></span>
      <div class="yellow-share pt10 pb20">
        <div class="red-title">奖品</div>
        <p class="ac color-orange p10">
          100%中奖哦！<br/>
          点赞越多获得大奖的几率就越高哦！
        </p>
        <div class="jp-list">
          iPhone7 plus（32G）<br/>
          iPhone7（32G）<br/>
          智能体脂秤<br/>
          运动蓝牙耳机<br/>
          TomTom运动手表<br/>
          乐心运动手环<br/>
          扑妞小店优惠券<br/>
          虎扑跑步定制勋章<br/>
          虎扑跑步定制速干T恤<br/>
          跑步书籍<br/>
          虎扑跑步限量定制钥匙扣
        </div>
      </div>
</section>
</body>
<script type="text/javascript">
  // var 
  $(function(){
    $(".gift-box").click(function(){
      $("#jp-list").show();
    })
    // 查看奖品列表
    $(".pao-close").click(function(){
      $(".masklayer").hide();
      window.location.reload();
    })

    // 关闭弹框
    $("#btn-num").click(function(){
      //alert(1)
       $.get("{$staticHost}/paome_share/shareDraw?target_uid="+{$target_uid}, {}, function(data, error) {
        data = JSON.parse(data);
        var info = data.result.winningInfo;

        console.log(info.id)
        $("#username").html(info.userName);
        $("#numzan").html(info.light);
        $("#jpName").html(info.name);
        $("#jhNum").html(info.remainTimes);
        if(info.id==5){
          $("#jpImg").attr("src","{$staticHost}/static/images/img/img.png")
        }else{
          $("#jpImg").attr("src","{$staticHost}/static/images/img/img2.png")
        }
        $("#num-box").show();
        // 弹窗显示
        $(".yellow-btn").click(function(){
          if(info.id==5){
             window.location.href="https://h5.koudaitong.com/v2/ump/promocard/fetch?alias=tywjl3is"
          }else{
            window.location.href="paoAddress?id="+info.id+"&target_uid="+{$target_uid}
          }
        })
        // 去哪领奖
        $(".red-btn").click(function(){
          if(info.remainTimes==0){
            $(".masklayer").hide();
          }else{
            winning() 
          }
        })
        // 再去抽奖
      })
    })
    // 点击抽奖
  })
  $(function(){
    var endtime = 1481471999;
    setInterval(function(){
      var now = parseInt((new Date()).getTime()/1000)
      var a = GetRTime(now,endtime)
    },0);
  });
  function GetRTime(stime,etime){
    var t =etime - stime;
    var d=0,h=0, m=0,s=0;
    if(t>=0){
      d=Math.floor(t/60/60/24);
      h=Math.floor(t/60/60%24);
      m=Math.floor(t/60%60);
      s=t-h*3600-m*60-d*86400
    }else{
      window.location.href="paomeHome";
    }
    if (h<10) {
      h = '0'+h
     }
     if (m<10) {
      m = '0'+m
     }
     if (s<10) {
      s = '0'+s
     }
    $("#t_d").text(d);
    $("#t_h").text(h);
    $("#t_m").text(m);
    $("#t_s").text(s);
    return s
  }

  function winning(){
    $.get("{$staticHost}/paome_share/shareDraw?target_uid="+{$target_uid}, {}, function(data, error) {
        data = JSON.parse(data);
        var info = data.result.winningInfo;
        $("#username").html(info.userName);
        $("#numzan").html(info.light);
        $("#jpName").html(info.name);
        $("#jhNum").html(info.remainTimes);
        if(info.id==5){
          $("#jpImg").attr("src","{$staticHost}/static/images/img/img.png")
        }else{
          $("#jpImg").attr("src","{$staticHost}/static/images/img/img2.png")
        }
        $("#num-box").show();
        // 弹窗显示
        $(".yellow-btn").click(function(){
          if(info.id==5){
             window.location.href="https://h5.koudaitong.com/v2/ump/promocard/fetch?alias=tywjl3is"
          }else{
             window.location.href="paoAddress?id="+info.id+"&target_uid="+{$target_uid}
          }
        })
        // 去哪领奖
      })
  }
  $("#convene").click(function(){
    if(typeof jw == "object") {
      jw.api('copy_current_url', JSON.stringify({'status': false}));
      jw.api('share_button', JSON.stringify({'status': true}));
      jw.api('set_share_info', JSON.stringify({
        'title': "我正在参与跑么杯争霸赛，需要你的助力！助力即可抽奖！",
        'description':"每人每天可抽奖三次，最高可赢得iPhone7",
        'img_url':'http://irun.hupu.com/static/images/share/pao.png',
        'link_url':'{$wxUrl}',
      }));
      jw.api('share', JSON.stringify({'channel': ''}));

    }
  })
</script>
{template 'show/web-footer'}
